<template>
  <div id="teamPage">
    <van-search placeholder="搜索队伍" v-model="searchText" @search="onSearch"/>
    <van-button class="add-button" type="primary" @click="doAddTeam"  icon="plus" round />
    <team-card-list :team-list="teamList"/>
    <van-empty v-if="!teamList || teamList?.length< 1" description="数据为空"/>
  </div>
</template>

<script setup lang="ts">

import {useRouter} from "vue-router";
import TeamCardList from "../components/TeamCardList.vue";
import {onMounted, ref} from "vue";
import myAxios from "../plugins/myAxios.ts";
import {showFailToast} from "vant";

const router = useRouter();

const searchText = ref("")
const listTeam = async (val = '') => {
  const res = await myAxios.get('/team/list', {
    params: {
      searchText: val,
      pageNum: 1,
    }
  })
  if (res.code === 0) {
    teamList.value = res.data;
  } else {
    showFailToast("加载队伍失败，请重试")
  }
}
const onSearch = (val: any) => {
  listTeam(val);
}
const doAddTeam = () => {
  router.push({
    path: "/team/add"
  })
}

const teamList = ref([]);
onMounted(async () => {
  await listTeam();
})

</script>


<style scoped>

</style>